<!DOCTYPE html>
<html lang="zh">
<head>
  <meta charset="UTF-8">
  <title>动物迁徙</title>
    <link href="https://registry.npmmirror.com/mars3d-cesium/latest/files/Build/Cesium/Widgets/widgets.css" rel="stylesheet" type="text/css" />
<script src="https://registry.npmmirror.com/mars3d-cesium/latest/files/Build/Cesium/Cesium.js" type="text/javascript"></script>
<script src="http://mars3d.cn/lib/turf/turf.min.js" type="text/javascript"></script>

<!--引入mars3d库lib-->
<link href="https://registry.npmmirror.com/mars3d/latest/files/mars3d.css" rel="stylesheet" type="text/css" />
<script src="https://registry.npmmirror.com/mars3d/latest/files/mars3d.js" type="text/javascript"></script>

<!--引入mars3d库插件lib（按需引入）-->
<script src="https://registry.npmmirror.com/mars3d-space/latest/files/mars3d-space.js" type="text/javascript"></script>
<link href="../css/index.css" rel="stylesheet" type="text/css" />
<link href="style.css" rel="stylesheet" type="text/css" />
  
</head>
<body>
    <header>
        <div class="logo">
            <img src="../css/src/md-pets@1x.png" alt="Logo">
            <span>odyssey of wildlife</span>
        </div>
        <nav>
            <ul>
<<<<<<< HEAD
                <li><a href="../2Dsection/hello.html" class="active">开始</a></li>
                <li><a href="../2Dsection/hello.html">科普展示</a></li>
                <li><a href="#">互动游戏</a></li>
                <li><a href="../Knowledge_git/homepage.html">科学知识库</a></li>
=======
                <li><a href="/animals_migration/2Dsection/hello.html" class="active">开始</a></li>
                <li><a href="/animals_migration/2Dsection/hello.html">科普展示</a></li>
                <li><a href="/animals_migration/3Dsection/game.html">互动游戏</a></li>
                <li><a href="/animals_migration/Knowledge_git/homepage.html">科学知识库</a></li>
>>>>>>> 8a9357666e0349b0aa9f25f88ddf41c7ee8fb6a9
                <li><a href="#">关于我们</a></li>
            </ul>
        </nav>
        <div class="user-actions">
            <a href="#" class="profile-btn">
                <img src="../css/src/user-icon.png" alt="User">
                <span>个人主页</span>
            </a>
            <a href="../login.html" class="login-btn">Login / Register</a>
        </div>
    </header>
<div class="container">
   <div class="map-container">
    <div id="map"></div>
  <div id="loading-container" class="loading-container">
    <div>正在加载中，请稍候...</div>
  </div>
  </div>
  <div class="info-panel">
    <h1>黑翅长脚鹬</h1>
    <div class="tag">百度百科</div>
    <p>
      &nbsp;&nbsp;&nbsp;&nbsp;黑翅长脚鹬是鸻形目反嘴鹬科长脚鹬属鸟类，别名有红腿娘子、高跷鸻。体长35-40厘米，两脚特长。腿和足呈粉红色；喙黑色，细长且笔直；头颈部的颜色在个体间变异较大；一些个体的头顶、羽冠、颈部至上背为白色；一些个体的头顶和后颈黑色或白色杂以黑色；上背、肩和两翅深黑色并带有绿色金属光泽；尾上覆羽白色，部分羽毛灰色；尾羽灰色；外侧尾羽颜色偏淡；身体其他部分体羽纯白色。雌鸟的背、肩和三级飞羽褐色，其余部分与雄鸟相似。幼鸟与雌鸟体色相似，上背部羽毛灰色。
黑翅长脚鹬在亚洲、欧洲、非洲及美洲的温带、亚热带和热带地区均有分布。栖息于开阔草地中的湖泊、沼泽等湿地或稻田、鱼塘。以环节动物、软体动物、虾、蝌蚪和昆虫等无脊椎动物为食。繁殖期在5-7月，营巢于开阔湖边的沼泽地或草地上，以苇茎、枯草等构筑碟状巢。窝卵数4枚，由雌雄亲鸟轮流孵卵，孵化期16-18天。
    </p>

   <div id="videoSection" style="position:relative;">
  <video id="videoContainer" width="100%" controls poster="#" autoplay muted>
  </video>
  <div id="infoPanel" style="position:absolute; top:20px; left:20px; z-index:2; background:rgba(255,255,255,0.85); border-radius:8px; padding:12px;">
    <div><b>时间：</b><span id="infoTime">-</span></div>
    <div><b>阶段：</b><span id="infoStage">-</span></div>
    <div><b>区域：</b><span id="infoActivity">-</span></div>
    <div><b>经度：</b><span id="infoLng">-</span></div>
    <div><b>纬度：</b><span id="infoLat">-</span></div>
    <div><b>高度：</b><span id="infoAlt">-</span></div>
  </div>
</div>
</div>
<script src="show.js"></script>
<script>
    // 可选：对showLoading和hideLoading函数进行实现
    function showLoading() {
      document.getElementById('loading-container').style.display = 'block';
    }
    
    function hideLoading() {
      document.getElementById('loading-container').style.display = 'none';
    }
  </script>
<script>

</script>
</body>
</html>
